<template>
	<div class="navs_box">
		<ul>
			<li v-for="(item,index) of nav" :key="index">
				<router-link :to="item.url">
					<img :src="item.icon" />
					<p>{{item.name}}</p>
				</router-link>
			</li>
		</ul>
	</div>
</template>

<script>
	export default{
		name:'navs',
		props:{
			nav:Array
		}
	}
</script>

<style scoped="scoped">
	.navs_box{
		width: 100%;
		margin: .23rem auto .25rem;
	}
	.navs_box ul li{
		display: inline-block;
		width: 20%;
		text-align: center;
	}
	.navs_box ul li img{
		width: 70%;
	}
	.navs_box ul li p{
		color: #333;
		font-size: .24rem;
		margin-top: .1rem;
	}
</style>
